<template> 
    <div class="modal trap-modal"  :id = "id" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">         
                    <h3 class="modal-title" id="myModalLabel"> {{$t('safeplot.fakecModalTitle')}}</h3>
                    <span class="close" data-dismiss="modal" aria-hidden="true">&times;</span>
                </div>
                <div class="modal-body">    
                    <div @click = "modalEvent('modal')" style="width: 40%">
                        <img :src="`/static/${themeColor}-img/self.png`" >
                        <p>{{$t('safeplot.fakeModalP1')}}</p>
                        <button class="sure-btn btn button button--aylen">{{$t('safeplot.fakeModalP1Btn')}}</button>
                    </div>
                    <div class="line"></div>
                    <div @click = "modalEvent('quick_set')" style="width: 40%">
                        <img :src="`/static/${themeColor}-img/quick.png`" >
                        <p>{{$t('safeplot.fakeModalP2')}}</p>
                        <button class="sure-btn btn button button--aylen">{{$t('safeplot.fakeModalP2Btn')}}</button>
                    </div>                     
                </div>
                 <div class="modal-footer">   				
                    <button  class="cancel-btn  button button--aylen" data-dismiss="modal">{{$t('common.cancelBtn')}}</button>
                </div>
            </div>
        </div>
    </div>    
</template>
<script> 
    export default {
        props: {
            id:{
                type:String
            },
            title:{
                type:String
            }        
		},
        data() {
            return{
                show:true,
                curpage:1,      
                params:{},
                error_msg:"",
                error_notice:'',
                result:"",
                format_error_arr:[]
            }
        },
        watch:{
            status() {
                this.result = this.status
                if (this.status=="error") {
                    this.error_msg = this.errorMsg    
                    this.error_notice = true
                }
                if (this.status=="ok") {
                    setTimeout(()=> {$('#'+this.id).modal('hide')}, 500)
                }
            },
            errorMsg() {
                if (this.errorMsg=="") {
                    this.error_msg = ''
                    this.error_notice = false
                }
            },
            editData() {
                this.params = this.editData
            },
        },
        methods:{
           modalEvent(set_type) {
                $('#'+this.id).modal('hide')
               this.$emit('sentSetType',set_type)
           }
        }
    }

</script>